<template>
  <div style="height:100%;width:100%;">

    <div style="width:100;height:calc(100% - 60px)">

        <div style="width:calc(100% - 20px);height:calc(100% - 40px);padding-top:20px;padding-bottom:20px;margin-right:20px;">
            <div style="width:100%;height:100%;overflow:auto;">
              <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
                <el-form-item label="食品名称" prop="foodName">
                  <el-input v-model="formData.foodName" placeholder="请输入食品名称" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
                <el-form-item label="食品描述" prop="foodDescribe">
                  <el-input v-model="formData.foodDescribe" placeholder="请输入食品描述" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
                <el-form-item label="价格" prop="price">
                  <el-input-number v-model="formData.price" placeholder="请输入价格" :step='1' :precision='2' :style="{width: '100%'}"
                    :max='99999999'></el-input-number>
                </el-form-item>
                <el-form-item label="折扣" prop="discount">
                  <el-input-number v-model="formData.discount" placeholder="请输入折扣" :step='1' :precision='2' :min='0.1' :style="{width: '100%'}"
                    :max='10'></el-input-number>
                </el-form-item>
                <el-form-item label="折扣价" prop="discountedPrice">
                  <el-input-number v-model="formData.discountedPrice" placeholder="请输入折扣价" :step='1' :precision='2' :style="{width: '100%'}"
                    :max='999999999'></el-input-number>
                </el-form-item>
                <el-form-item label="库存数量" prop="amount">
                  <el-input-number v-model="formData.amount" placeholder="请输入库存数量" :step='1' :precision='0' :style="{width: '100%'}"
                    :max='999999999'></el-input-number>
                </el-form-item>
              </el-form>
          </div>
        </div>
        
    </div>

    <div style="width:100%;height:60px;background-color:#eeeeee;z-index:999;">

        <div style="float:right;height:60px;line-height:60px;margin-right:20px;">
          <el-button type="success" @click="formSubmit" class="button-green">确定</el-button>
          <el-button type="warning" @click="formCancel" class="button-yellow">取消</el-button>
        </div>

        
    </div>

    
  </div>
</template>
<script>
export default {
  components: {},
  props: [],
  data() {
    return {
      formData: {
        foodName: undefined,
        foodDescribe: undefined,
        price: undefined,
        discount: undefined,
        discountedPrice: undefined,
        amount: undefined,
      },
      rules: {
        foodName: [{
          required: true,
          message: '请输入食品名称',
          trigger: 'blur'
        }],
        foodDescribe: [],
        price: [{
          required: true,
          message: '请输入价格',
          trigger: 'blur'
        }],
        discount: [],
        discountedPrice: [],
        amount: [],
      },
    }
  },
  computed: {},
  watch: {},
  created() {
    var _this = this;
    //根据id查找对象详细
    _this.formDataById(_this.iframeData.rowId);
  },
  mounted() {},
  props: {
    layerid: {//自动注入的layerid
      type: String,
      default: ''
    },
    iframeData: {//传递的数据
      type: Object,
      default: () => {
        return {};
      }
    },
    lydata:{
      type: Object,
      default: () => {
        return {};
      }
    }
  },
  methods: {
    formSubmit(){//提交表单


      var _this = this;

      if(!_this.iframeData.rowId){
         _this.$layer.msg('未找到编号，不是有效的页面');
        return;
      }


      _this.$refs['elForm'].validate(valid => {
        if (!valid) return
        
        //更新父对象数据信息
        //_this.$parent.$data.iframeData = Object.assign({}, _this.form);//拷贝

        let loadingId = _this.$layer.loading({});
        
        _this.$axios({
          method: 'post',
          url: 'http://127.0.0.1:8888/shop/food/testEditSave',
          data: _this.$qs.stringify(
            _this.formData
          )
        })
        .then(function (response) {
            _this.$layer.close(loadingId);
            let result = response.data;
            if(result){
              if(result.code===0){//成功
                  _this.$parent.$layer.msg('编辑成功');
                  _this.$parent.findList();//执行父级页面的刷新
                  _this.$layer.close(_this.layerid);
              }else if(result.code===301){//警告
                _this.$layer.alert("编辑成功,但存在警告（"+result.msg+"）",{
                    title: '提示',
                    icon:0  //0,1,2,3
                  },lid => {
                    _this.$layer.close(lid);
                     _this.$layer.close(_this.layerid);//关闭编辑的弹窗
                  }
                );
              }else if(result.code===500){//错误
               _this.$layer.alert("编辑失败",{
                    title: '提示',
                    icon:1  //0,1,2,3
                  },lid => {
                    _this.$layer.close(lid);
                  }
                );

              }
            }
        })
        .catch(function (error) {
           _this.$layer.close(loadingId);
           console.log(error);
        });


      })
    },
    formCancel(){//关闭弹窗
      var _this = this;
      _this.$layer.close(_this.layerid);
    },
    formDataById(rowId){//根据行id查找对象
      let _this = this;
      _this.$axios({
          method: 'post',
          url: 'http://127.0.0.1:8888/shop/food/findById',
          data: _this.$qs.stringify(
            {id:rowId}
          )
        })
        .then(function (response) {
            let result = response.data;
            if(result){
              for(var key in result){
                if(result[key]!==null){
                   _this.formData[key] = result[key];
                }
              }
            }
        })
        .catch(function (error) {
          console.log(error);
        });



    }
  }
}

</script>
<style>
    /* .vl-notify-iframe{
      padding:0px !important;
      margin:0px !important;
    }
    .vl-notify-content{
      height:560px !important;
    } */
</style>
